Safari 老版本浏览器在 owlCarousel 中 input 输入无效问题

| 选择喜欢的代码风格  

Safari + owlCarousel 中 input 无法输入,失效的原因分析


1. 触控事件冲突

  • owlCarousel 的拖拽/滑动事件可能拦截了 touchstartclick 事件
  • 旧版 Safari 对事件冒泡处理可能存在兼容性问题

  • 2. CSS 层级干扰

  • Carousel 项的 z-indexoverflow 属性导致 input 被遮挡
  • 可能意外设置了 pointer-events: noneuser-select: none

  • 3. 元素克隆问题

  • 如果启用了 loop 模式,owlCarousel 会克隆元素,可能导致原始 input 失效
  • Mac 10.13.6 的 Safari 版本较旧(约 Safari 13),可能存在特殊兼容问题
  • 总结


    最终排查到,页面启用了样式: pointer-events: noneuser-select: none,去掉即可。

    Safari 扩展阅读:


     

    CommandNotFound ⚡️ 坑否 - 其他频道扩展阅读:




    发表评论